import axios from 'axios'

// 导入 vuex 实例
import store from '../store'
// 导入 router 实例
import router from '../router'

// 1. axios.create 创建新的 axios 实例
const request = axios.create({
  // baseURL 后台基础地址
  baseURL: 'http://pcapi-xiaotuxian-front-devtest.itheima.net'
  // baseURL: 'http://pcapi-xiaotuxian-front.itheima.net'
})

// 2. 给 request 添加拦截器
// 请求拦截器 -> 发请求之前
request.interceptors.request.use(config => {
  // 使用场景: 全局注入 token
  /**
   * 1. 获取 token -> vuex
   * 2. 设置 header
   */
  const { token } = store.state.user.profile
  if (token) {
    // 根据后台文档添加 headers 参数
    // Bearer 后面加空格
    config.headers.Authorization = `Bearer ${token}`
  }
  return config
}, e => Promise.reject(e))

// 响应拦截器 -> 发请求之后
request.interceptors.response.use(
  (response) => {
    // 请求成功: 2xx
    // console.log('后台返回: ', response)
    // === 指定返回的数据 ===
    const returnData = {
      msg: response.data.msg,
      data: response.data.result
    }
    // return response
    return returnData
  },
  (error) => {
    // 请求失败: 2xx 以外
    // 使用场景: 401 -> 处理返回数据 token 失效跳回到登录页
    if (error.response.status === 401) {
      /**
       * 1. 获取当前访问页面的地址
       * 2. 跳回登录页并携带当前访问页面的地址 -> 登陆成功之后, 可以回跳到上次 401 访问的页面
       */
      /**
       * 获取当前页面地址:
       * vue2 -> router.currentRoute.path
       * vue3 -> router.currentRoute.value.path
       */
      store.dispatch('user/logoutAction')
      const backPath = router.currentRoute.value.path
      router.replace(`/login?backPath=${backPath}`)
    }
    return Promise.reject(error)
  }
)

/**
 * 对 axios.create() => request 做二次封装 -> 方便使用
 * 1. 不封装, 用 request 发请求
 * request({
 *   url: 'path',
 *   method: 'get | post | delete',
 *   params: {}, // get 请求
 *   data: {} // post 请求
 * }).then()
 *
 * 2. 二次封装 -> 自定义参数
 */
/**
 *
 * @param {*} url 请求地址
 * @param {*} method 请求方法
 * @param {*} data 请求参数
 * return 请求的 Promise 对象
 *
 * 使用 myRequest 发请求, 示例: myRequest(url, method, data).then()
 */
// 二次封装
const myRequest = (url, method, data) => {
  // 返回请求的 Promise 对象
  return request({
    url,
    method,
    // 根据 method 动态添加 params 和 data 属性并赋值: []
    [method === 'get' ? 'params' : 'data']: data
    // params: {}, // get 请求
    // data: {}
  })
}

// 3. 导出 request | myRequest 实例
// export default request
export default myRequest
